<style include="settings-shared"></style>
<settings-animated-pages id="pages" section="bluetooth"
    focus-config="[[focusConfig_]]">
  <div route-path="default">
    <template is="dom-if" if="[[!isSecondaryUser_]]">
      <div id="bluetoothDevices"
          class="settings-box two-line first no-padding">
        <div class="link-wrapper" actionable on-click="onTap_">
          <iron-icon icon="[[getIcon_(bluetoothToggleState_)]]"></iron-icon>
          <div class="middle settings-box-text" aria-hidden="true">
            $i18n{bluetoothPageTitle}
            <div class="secondary" id="bluetoothSecondary">
              [[getOnOffString_(bluetoothToggleState_,
              '$i18nPolymer{deviceOn}', '$i18nPolymer{deviceOff}')]]
            </div>
          </div>
          <cr-policy-pref-indicator
              icon-aria-label="$i18n{bluetoothPageTitle}"
              pref="[[prefs.cros.device.allow_bluetooth]]"
              hidden="[[prefs.cros.device.allow_bluetooth.value]]">
          </cr-policy-pref-indicator>
          <template is="dom-if" if="[[bluetoothToggleState_]]">
            <cr-icon-button class="subpage-arrow"
                on-click="onSubpageArrowTap_"
                aria-label="$i18n{bluetoothPageTitle}"
                aria-describedby="bluetoothSecondary"
                aria-roledescription="$i18n{subpageArrowRoleDescription}">
            </cr-icon-button>
          </template>
        </div>
        <div class="separator"></div>
        <cr-toggle id="enableBluetooth"
            class="margin-matches-padding"
            checked="{{bluetoothToggleState_}}"
            disabled$="[[!isToggleEnabled_(
                adapterState_, stateChangeInProgress_)]]"
            aria-label="$i18n{bluetoothToggleA11yLabel}"
            deep-link-focus-id$="[[Setting.kBluetoothOnOff]]"
            on-change="onBluetoothToggledByUser_">
        </cr-toggle>
      </div>
    </template>
    <template is="dom-if" if="[[isSecondaryUser_]]">
      <div id="bluetoothDevices" class="settings-box two-line">
        <iron-icon class="policy" icon="cr:group"></iron-icon>
        <div class="middle settings-box-text">
          [[i18n('bluetoothPrimaryUserControlled', primaryUserEmail_)]]
        </div>
      </div>
    </template>
  </div>
  <template is="dom-if" route-path="/bluetoothDevices">
    <settings-subpage page-title="$i18n{bluetoothPageTitle}">
      <settings-bluetooth-subpage
          adapter-state="[[adapterState_]]"
          bluetooth-toggle-state="{{bluetoothToggleState_}}"
          state-change-in-progress="[[stateChangeInProgress_]]"
          bluetooth="[[bluetooth]]"
          bluetooth-private="[[bluetoothPrivate]]">
      </settings-bluetooth-subpage>
    </settings-subpage>
  </template>
</settings-animated-pages>
